import QtQuick 2.2
import QtQuick.Controls 1.1

import "../common"
import "../delegate"

Rectangle {
    id: idArticleContent
    width: id_mainwindow.width  /* alignment */
    height: id_mainwindow.height - id_mainwindow.mHeader.height

    property string txtArticleTitle: ""
    property string txtArticleThumbnaiImageFromSource: ""
    property string txtArticleTime: ""
    property string txtArticleNameSource: ""
    property string txtArticleContent: ""

    y: parent.mHeader.height


    visible: false

    ScrollBar {
        scrollArea: flickArea;
        height: flickArea.height;
        width: 8
        anchors.right: flickArea.right
    }

    Flickable {
        id: flickArea
        anchors.rightMargin: 0
        anchors.leftMargin: 5
        anchors.bottomMargin: 2
        anchors.topMargin: 2
        anchors.fill: parent
        antialiasing: true
        contentWidth: idArticleContent.width-10;
        contentHeight: contentColumn.height //txtContent.contentHeight
//        contentWidth: idArticleContent.width;
//        contentHeight: txtContent.contentHeight + idTitle.height + idThumbnaiImage.height + 40
        flickableDirection: Flickable.VerticalFlick
        clip: true

        Column {
            id:contentColumn
            spacing: 5

            Text {
                id: idTitle
                text: txtArticleTitle
                font.family: "Helvetica"
                font.pointSize: 24
                width: idArticleContent.width - 10
                horizontalAlignment: Text.AlignHCenter
                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
            }

            Line{}

            Row {
                spacing: 20

                Image {
                    id: idThumbnaiImage
                    source: txtArticleThumbnaiImageFromSource
                }

                Text {
                    id: idSourceArticle
                    text: txtArticleNameSource
                    font.family: "Arial"
                    font.italic: true
                    verticalAlignment: Text.AlignBottom
                    opacity: 0.5
                }

                Text {
                    id: idTime
                    text: txtArticleTime
                    font.family: "Arial"
                    font.italic: true
                    verticalAlignment: Text.AlignBottom
                    opacity: 0.5
                }
            }

            Line {}

            Text {
                id: txtContent
                width: flickArea.width-10
                //height: articleContent.height
                font.family: "Arial"
                //style: Text.Sunken
                horizontalAlignment: Text.AlignJustify
                anchors.fill: flickArea
//                height: idArticleContent.height // Chieu cao de tu nhien di
                text: txtArticleContent
                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
            }
        }

    }


}
